<template>
  <div class="">
    <div v-for="formbox in cusForms">
        <h3 class="slideDialog_title">{{formbox.formName}}</h3>
        <div class="slideDialog_item">

        <el-form label-width="110px" label-position="right" :inline="false">
          <div class="control-lump" v-for="formItem in formbox.details">

            <el-form-item
            v-if="formItem.orders===1 && formItem.type===1" :label="formItem.widgetName">
              <el-input :placeholder="'请输入'+formItem.widgetName"></el-input>
            </el-form-item>

            <el-form-item
            v-if="formItem.orders===2 && formItem.type===1" :label="formItem.widgetName" >
            <el-input
             type="textarea"
             :rows="2"
             :placeholder="'请输入'+formItem.widgetName">
            </el-input>
            </el-form-item>

            <el-form-item
            v-if="formItem.orders===6 && formItem.type===2" :label="formItem.widgetName" >
              这是一个映射控件
            </el-form-item>

            <el-form-item
            v-if="formItem.orders===4 && formItem.type===1" :label="formItem.widgetName" >
            <el-date-picker
              style="width:100%"
              type="date"
              placeholder="选择日期">
            </el-date-picker>
            </el-form-item>

            <el-form-item
            v-if="formItem.orders===13 && formItem.type===1" :label="formItem.widgetName" >
              这是一个分组控件
            </el-form-item>

            <el-form-item
            v-if="formItem.orders===16 && formItem.type===1" :label="formItem.widgetName" >
            <el-button @click="seeChildFrom" style="width:100%">查看子表达内容<i class="el-icon-arrow-right el-icon--right"></i></el-button>
            </el-form-item>
          </div>
        </el-form>

        <!-- 子表单显示 -->
        <el-form v-if="childFrom">
            <el-form-item>

            </el-form-item>
        </el-form>
        </div>
    </div>
    <!-- <tableControl :v-if="cusForms" :cusForms.sync="cusForms.details"></tableControl> -->
  </div>
</template>

<script>
export default {
  name:"tableControl",
  props:["cusForms"],
  data(){
    return{
      childFrom:false
    }
  },
  methods:{
    seeChildFrom(){
      this.childFrom=true
    }
  },
  created(){

  }
}
</script>
<style scoped lang="scss">
  @import "./dialog.scss";
</style>
